﻿<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/v2/console/common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<head>
	<title>搜索</title>
  <meta charset="UTF-8">
  <link rel="stylesheet" type="text/css" href="${path}/party/css/bootstrap.min.css">
  <link rel="stylesheet" type="text/css" href="${path}/party/css/pagination.css">
  <link rel="stylesheet" type="text/css" href="${path}/party/css/main.css">
</head>
<body>
<div id="listVm">
  <div class="dj-head">
    <iframe src="http://djzx.sktcm.cn/dangjian/modules/nav_login.html" width="100%" height="45" scrolling="no" ></iframe>
    <!-- logo/一级导航 -->
    <div class="dj-nav1 dj-nav1-border-bottom">
      <div class="nav-center">
        <a href="javascript:;" class="logo"> <img src="${path}/party/images/logo.png" /> </a>
        <ul class="nav1-ul">
          <template v-for="(item,index) in menuList">
	          <li :class="{active:index == 0}" @click="setUrl(item)">{{item.name}}</li>
          </template>
           <li @click="dkzx()">课程在线</li>
        </ul>
      </div>
    </div>
  </div>
  <!-- 内容部分 -->
  <div class="dj-body">
    <div class="center-div">
      <div class="search-div">
        <div class="search-classify-div">
	         <template v-for="(secondMenu,index) in secondMenus">
	           <a href="javascript:;" :class="{active:index == activeVal}" @click="setMenu(secondMenu.id,index)">{{secondMenu.name}}</a>
	         </template>
        </div>
        <div class="search-form">
          <input class="sear-input form-control" placeholder="请输入查询的内容" v-model="searchValue">
          <button class="sear-btn" @click="search()"><i class="sear-icon"></i> 搜索</button>
        </div>
      </div>
      <div class="search-list">
        <h4> <hr> <span>热点政策</span> <hr> </h4>
        <div class="search-list-div">

			<template v-for="item in artcles" v-cloak>
	          <a href="javascript:;" class="item-list-a" @click="artcleDetail(item.articleId)">
	            <h5>{{item.title}}--{{item.id}}</h5>
	            <span>————{{item.subtitle}}</span>
	            <p>{{item.content}}</p>
	          </a>
			</template>

        </div>
      </div>

      <!-- 分页 -->
      <div class="pagination">
        <div id="pagination" class="page"></div>
      </div>
    </div>
  </div>
  <!-- 页底部分 -->
  <jsp:include page="footer.jsp"></jsp:include>
</div>
<!-- javascritp flie -->
<script type="text/javascript" src="${path}/party/js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="${path}/party/js/jquery.pagination.js"></script>
<script type="text/javascript" src="${path}/party/js/rem(750).js"></script>
<script type="text/javascript" src="${path}/party/js/vue2.js"></script>
<script type="text/javascript" src="${path}/party/plugin/nav-moveline/js/jquery.easing.js"></script>
<script type="text/javascript" src="${path}/party/plugin/nav-moveline/js/moveline.js"></script>
<script type="text/javascript" src="${path}/party/plugin/nav-moveline/js/toast.js"></script>
<script type="text/javascript">

	var menuId = ${menuId};

    var vm = new Vue({
        el: '#listVm',
        data: {
        	menuId:"",
        	secondMenus:[],
        	secondId:'',
        	artcles:[],
        	searchValue:"",
        	activeVal: 0,
        	menuList:[]
        },
        created:function(){
        	let _that = this;
        	this.getMenu1();
        	//首次加载数据
        	$.ajax({
				type : "post",
				url : "${path}/web/querySecondMenu.html",
				dataType : "json",
				data:{
					menuId:menuId
				},
				async : false,
				success : function(data) {
					if(data.ajax_status == "ajax_status_success"){
						_that.secondMenus = data.secondMenus;
						_that.secondId = data.secondId;
						_that.queryArticleList(1);
					}
					
				},
				error : function(XMLHttpRequest, textStatus, errorThrown){
		          alert("出错了！");
		       }
			});
        },
        methods: {
          classify: function (e) {
            console.log(6666);
          },
          artcleDetail:function(artcleId){
        	  window.location.href="${pageContext.request.contextPath}/web/artcle/goArticleDetail.html?articleId="+artcleId;
          },
          setMenu: function (menuId,ind) {
              console.log(menuId);
              this.secondId = menuId;
              this.queryArticleList(1);
              this.activeVal = ind;
          },
          search:function(){
        	 this.queryArticleList(1);
          },
          queryArticleList:function(start){
        	 
        	  let _that = this;
        	  $.ajax({
    				type : "post",
    				url : "${path}/web/queryArticleList.html",
    				dataType : "json",
    				data:{
    					menuId:this.secondId,
    					start:start,
    					serchValue:_that.searchValue
    				},
    				async : false,
    				success : function(data) {
    					if(data.ajax_status == "ajax_status_success"){
    						_that.artcles = data.page.datasource;
    						_that.pageCallback(data.page.absolutePage);
    					}
    					
    				},
    				error : function(XMLHttpRequest, textStatus, errorThrown){
    		          alert("出错了！");
    		       }
    			});
            },
            pageCallback:function(pageCount){
            	if(pageCount == 0){
     				pageCount = 1;
     			}
            	let _that = this;
                _that.$nextTick(function(){
                	 //分页初始化
                    $('#pagination').pagination({
                      callback:_that.pageData,
                      prevContent: "上一页",
                      nextContent: "下一页",
                      prevCls:'prev',
                      nextCls:'next',
                      totalData:pageCount,
                      showData:1,
                      num_edge_entries: 3,       //当分页非常多时，两侧首尾分页条目数为3条，不显示的部分用省略号代替
 	                  num_display_entries: 9    //当分页非常多时，连续分页最多显示9条，不显示的部分用省略号代替
                    });
                    //分页初始化
                  });
     		},
     		pageData:function(pagenation,jq){
     			
     			let _that = this;
          	    $.ajax({
      				type : "post",
      				url : "${path}/web/queryArticleList.html",
      				dataType : "json",
      				data:{
      					menuId:this.secondId,
      					start:pagenation.getCurrent(),
    					serchValue:_that.searchValue
      				},
      				async : false,
      				success : function(data) {
      					if(data.ajax_status == "ajax_status_success"){
      						_that.artcles = data.page.datasource;
      					}
      					
      				},
      				error : function(XMLHttpRequest, textStatus, errorThrown){
      		          alert("出错了！");
      		       }
      			});
        	},
        	getMenu1(){
          	  let _that = this;
        	  //获取推荐内容
        	  $.ajax({
  				type : "post",
  				url : "${path}/web/getFirstMenuHome.html",
  				dataType : "json",
  				data:{},
  				async : false,
  				success : function(data) {
  					if(data.ajax_status == "ajax_status_success"){
  						
  						_that.menuList = data.mlist;
  					}
  				},
  				error : function(XMLHttpRequest, textStatus, errorThrown){
  		          alert("出错了！");
  		       }
  			});
      },
      setUrl:function(data){
    	  window.location.href="${path}/web/setLink.html?type="+data.redirectUrl+"&id="+data.id;
      },
      dkzx:function(){
      	  window.location.href="http://djzx.sktcm.cn/web/coursetype/courseType.html"
      },
      djzd:function(){
    	  window.location.href="${path}/web/setLink.html?type=2&id=1535712460347003";
      },
      ddjs1:function(){
    	  window.location.href="${path}/web/setLink.html?type=3&id=1535712460347004";
      },
      zrwh:function(){
    	  window.location.href="${path}/web/setLink.html?type=4&id=1535712460347005";
      },
      dlwh:function(){
    	  window.location.href="${path}/web/setLink.html?type=5&id=1536204724351000";
      }
          
        }
    });
    vm.$nextTick(function(){
      $('.nav1-ul').moveline({customTop:true,top:0});//一级导航动画初始化 
      //分页初始化
    });
</script>
</body>
</html>
